I am trying to fetch data from the Zillow API through RapidApi. I am new to NextJS.
Here is the code from my index.js:
export async function getStaticProps() {
const propertyForSale = await fetchApi(`${baseUrl}/propertyExtendedSearch/list?location=Texas&purpose=for-sale&hitsPerPage=6`)
const propertyForRent = await fetchApi(`${baseUrl}/propertyExtendedSearch/list?location=Texas&purpose=for-rent&hitsPerPage=6`)
return {
props: {
propertiesForSale: propertyForSale?.hits,
propertiesForRent: propertyForRent?.hits,
}
}
}
Here is the code from my fetchApi.js:
export const baseUrl = 'https://zillow-com1.p.rapidapi.com'
export const fetchApi = async (url) => {
const { data } = await axios.get ((url), {
headers: {
'x-rapidapi-host': 'zillow-com1.p.rapidapi.com',
'x-rapidapi-key': '8e2e11ca6dmsh77a061b9b854a4ep1762d7jsne6e273637c9f'
}
})
return data;
}
I ran through your request through postman and it does not return any results
curl --location --request GET 'https://zillow-com1.p.rapidapi.com/propertyExtendedSearch/list?location=Texas%26purpose=for-sale%26hitsPerPage=6' \
--header 'x-rapidapi-host: zillow-com1.p.rapidapi.com' \
--header 'x-rapidapi-key: 8e2e11ca6dmsh77a061b9b854a4ep1762d7jsne6e273637c9f'
It returns
{
"status": "error",
"statusMessage": "Endpoint no found! Check your query URL and parameters!"
}
Check your get request outside of code and re-post the question. For stability of the solution and if the API offers the status node consistently you should check for success before proceeding to access other values.
//change the ?. hit to ?.data just the way i did it below
export async function getStaticProps() {
const propertyForSale = await fetchApi(${baseUrl}/propertyExtendedSearch/list?location=Texas&purpose=for-sale&hitsPerPage=6)
const propertyForRent = await fetchApi(${baseUrl}/propertyExtendedSearch/list?location=Texas&purpose=for-rent&hitsPerPage=6)
return { props: { propertiesForSale: propertyForSale?.data, propertiesForRent: propertyForRent?.data, } } }